<template>
	<view class="ai-photo-container" :style="navbarStyleVars">
		<!-- 导航栏 -->
		<aitip-nav-top 
			:nav-opacity="1"
			:title="'AI换脸'"
			:show-collection-button="true"
			:show-share-button="true"
			@go-back="goBack"
			@collection="viewFavorites"
			@share="shareToWeChat"
		></aitip-nav-top>

		<!-- 主要内容区域 -->
		<view class="main-content">
			<!-- 主图展示区域 -->
			<view class="main-image-section">
				<!-- 主图容器 -->
				<view class="main-image-container">
					<image 
						:src="selectedTemplate.image" 
						mode="aspectFill" 
						class="main-image"
						:class="{ 'fade-in': isImageChanging }"
						@load="onImageLoad"
					></image>
				</view>
				
				<!-- 右侧悬浮缩略图列表 -->
				<view class="floating-thumbnails">
					<view 
						class="thumbnail-item"
						v-for="template in templates"
						:key="template.id"
						:class="{ selected: selectedTemplate.id === template.id }"
						@click="selectTemplate(template)"
					>
						<image :src="template.image" mode="aspectFill" class="thumbnail-image"></image>
						<!-- 选中指示器 -->
						<view class="selected-indicator" v-if="selectedTemplate.id === template.id">
							<text class="check-mark">✓</text>
						</view>
					</view>
					

				</view>
			</view>

		</view>
		
		
		<!-- 我的作品按钮 -->
		<view class="my-works-button" v-if="hasGeneratedWorks" @click="viewMyWorks">
			<!-- 使用文本图标替代外部图片链接 -->
			<view class="works-icon-text">📷</view>
		</view>
		
		<!-- 重新上传照片按钮 -->
		<view class="upload-photo-button" @click="uploadPhoto">
			<image 
				:src="uploadedImageUrl || '/static/images/tabbar/kefu.png'" 
				mode="aspectFill" 
				class="upload-avatar"
				@load="onUploadImageLoad"
				@error="onUploadImageError"
			></image>
			<view class="avatar-border"></view>
			<view class="upload-plus" v-if="!uploadedImageUrl">+</view>
			<view class="upload-checkmark" v-if="uploadedImageUrl">✓</view>
		</view>
		
		<!-- 悬浮生成按钮 -->
		<view class="floating-generate-button" @click="generatePhoto" :class="{ 'generating': isGenerating }">
			<text class="generate-text">{{ isGenerating ? '生成中...' : '立即生成' }}</text>
		</view>
		

		
		<!-- 首页活动弹窗 -->
		<view class="home-modal-overlay" v-if="showShareModalFlag" @click="closeShareModal">
			<view class="home-modal-content" @click.stop>
				<!-- 活动图片 -->
				<image src="https://cdn.zhzfpn.cn/PicGo/20250830221404597.png" mode="aspectFit"
					class="home-activity-image"></image>
				<!-- 关闭按钮 -->
				<view class="home-close-button" @click="closeShareModal">
					<text class="home-close-text">关闭</text>
				</view>
				<!-- 分享按钮组 -->
				<view class="home-share-buttons-group">
					<button class="home-share-button home-join-activity-button" open-type="share" @click="handleShareForReward">
						<text class="home-share-text">分享获取兑换券</text>
					</button>
				</view>
			</view>
		</view>

		<!-- 结果预览弹窗 -->
		<view class="result-modal" v-if="showResultModal" @click="closeResultModal">
			<view class="result-modal-content" @click.stop>
				<!-- 顶部操作栏 - 优化后的绿色风格 - 优化后的绿色风格 -->
				<view class="result-modal-header">
					<!-- 左上角关闭按钮 -->
					<view class="result-close-button" @click="closeResultModal">
						<text class="result-close-icon">×</text>
					</view>
					<!-- <text class="result-modal-title">换脸结果</text> -->
				</view>
				

				
				<!-- 图片显示区域 -->
				<view class="result-modal-body">
					<image 
						:src="resultImageUrl" 
						mode="aspectFit" 
						class="result-image"
						@click="previewImage"
					></image>
				</view>
				
				<!-- 底部操作区域 - 去除水印按钮 -->
				<view class="result-bottom-actions" v-if="shouldShowViewOriginalButton">
					<button class="view-original-btn" @click="payToRemoveWatermark">
						<view class="btn-text-wrapper">
							<text class="btn-main-text">付费去水印</text>
							<text class="btn-sub-text">（仅需<text>0.01元</text>去除水印）</text>
						</view>
					</button>
				</view>
				
				<!-- 添加分享按钮 - 只有在去除水印后才显示 -->
				<view class="result-share-actions" v-if="resultImageUrl && !shouldShowViewOriginalButton">
					<button class="share-result-btn" open-type="share">
						<view class="btn-text-wrapper">
							<text class="btn-main-text">分享给朋友</text>
							<text class="btn-sub-text">（让朋友也来体验）</text>
						</view>
					</button>
				</view>
			</view>
		</view>
		
		<!-- 奖励二维码弹窗 -->
		<view class="reward-dialog" v-if="showRewardDialog">
			<view class="dialog-mask" @click="closeRewardDialog"></view>
			<view class="dialog-content reward-content">
				<view class="dialog-title">恭喜获得礼物兑换券！</view>
				<view class="qrcode-container">
					<image :src="qrcodeImage" mode="aspectFit" class="qrcode-image"></image>
				</view>
				<view class="coupon-info">
					<view class="coupon-code">兑换券编号：{{ couponCode }}</view>
					<view class="coupon-expire">有效期至：{{ expireDate }}</view>
					<view class="coupon-desc">请到线下门店出示此二维码进行核销</view>
				</view>
				<view class="dialog-buttons">
					<button class="save-btn" @click="saveQrcode">保存到相册</button>
					<button class="close-btn" @click="closeRewardDialog">我知道了</button>
				</view>
			</view>
		</view>

		<!-- 保存成功提示 -->
		<view class="save-success" v-if="showSaveSuccess">
			<view class="success-content">
				<text class="iconfont icon-ic_complete1"></text>
				<text class="success-text">已保存到相册</text>
			</view>
		</view>
	</view>
</template>

<script>
import { chooseAndUploadImage } from '@/api/ai-trip/uploadService.js'
import { swapFace, swapFaceWithRetry } from '@/api/ai-trip/faceSwapService.js'
import { generateUserTextWatermark, generateSimpleTextWatermark } from '@/api/ai-trip/textWatermarkService.js'
import { isLoggedIn, getUserInfo } from '@/api/ai-trip/auth.js'
import { createRechargeOrder, getPayParams, getCreditPackages } from '@/api/ai-trip/credit.js'
import aitipNavTop from '@/components/aitipNavTop/index.vue'

export default {
	components: {
		aitipNavTop
	},
	data() {
		return {
			selectedTemplateId: 2, // 默认选择第二个模板（泉州簪花）
			uploadedImageUrl: '', // 用户上传的图片URL
			swapResult: null, // 换脸结果
			isGenerating: false, // 是否正在生成中
			showResultModal: false, // 是否显示结果弹窗
			showShareModalFlag: false, // 是否显示分享活动弹窗
			hasShared: false, // 是否已完成分享
			resultImageUrl: '', // 结果图片URL
			activityImagePath: 'https://cdn.zhzfpn.cn/PicGo/20250830221404597.png', // 活动图片路径
			imageLoadFailed: false, // 图片是否加载失败
			isImageChanging: false, // 是否正在切换图片
			hasGeneratedWorks: true, // 临时设为true来测试按钮显示
			myWorksData: [], // 我的作品数据
			pendingShare: false, // 是否正在等待分享去水印
			templates: [
				{
					id: 1,
					title: '福建·平潭时光',
					image: 'https://ybpark.oss-cn-beijing.aliyuncs.com/2207191635365062413/2025/7/1/1/a82177b50505f7ef2ebd1120ced2cd29.jpg',
					points: 10,
					modelId: 'mt_1953340127516041216'
				},
				{
					id: 2,
					title: '福建·泉州簪花',
					image: 'https://ybpark.oss-cn-beijing.aliyuncs.com/2207191635365062413/2025/7/1/1/3761bb5c3b209ad926b88a0d4b082f00.jpg',
					points: 10,
					modelId: 'mt_1953340138781941760'
				},
				{
					id: 3,
					title: '北京·首都映像',
					image: 'https://ybpark.oss-cn-beijing.aliyuncs.com/2207191635365062413/2025/7/1/1/c5ea68bf09b22d1ef7a85eb204e43c77.png',
					points: 10,
					modelId: 'mt_1953340144985317376'
				},
				{
					id: 4,
					title: '福建·鳜影雅韵',
					image: 'https://ybpark.oss-cn-beijing.aliyuncs.com/2207191635365062413/2025/7/1/1/e9d2bb50c2afa56b0d60ca1c290785e4.png',
					points: 10,
					modelId: 'mt_1953340154955177984'
				}
			],
			originalResultImageUrl: '', // 原始结果图片URL（无水印）
			// 添加礼品兑换券相关数据
			showRewardDialog: false, // 是否显示奖励二维码弹窗
			qrcodeImage: 'https://cdn.zhzfpn.cn/PicGo/20250903113454004.png', // 二维码图片链接
			couponCode: 'GIFT' + Math.floor(100000 + Math.random() * 900000), // 随机兑换券编号
			expireDate: '2025-12-31', // 兑换券有效期
			showSaveSuccess: false, // 控制保存成功提示显示
		}
	},
	
	computed: {
		// 活动图片URL
		activityImageUrl() {
			// 在不同平台使用不同的路径格式
			// #ifdef H5
			return 'https://cdn.zhzfpn.cn/PicGo/20250830221404597.png';
			// #endif
			// #ifdef MP-WEIXIN
			return 'https://cdn.zhzfpn.cn/PicGo/20250830221404597.png';
			// #endif
			// #ifdef APP-PLUS
			return 'https://cdn.zhzfpn.cn/PicGo/20250830221404597.png';
			// #endif
			return 'https://cdn.zhzfpn.cn/PicGo/20250830221404597.png';
		},
		
		// 计算导航栏样式变量
		navbarStyleVars() {
			// 添加安全检查，防止undefined导致页面崩溃
			const navbar = this.$navbar || { statusBarHeight: 44, totalHeight: 88 };
			const capsule = this.$capsule || { 
				height: 32, 
				toStatusBarGap: 8, 
				toTopDistance: 88 
			};
			
			return {
				'--status-bar-height': (navbar.statusBarHeight || 44) + 'rpx',
				'--navbar-total-height': ((navbar.totalHeight || 88) + 15) + 'rpx', // 增加30像素(15*2)
				'--capsule-height': (capsule.height || 32) + 'rpx',
				'--capsule-gap': ((capsule.toStatusBarGap || 8) + 15) + 'rpx', // 增加30像素(15*2)
				'--capsule-to-top': (capsule.toTopDistance || 88) + 'rpx' // 胶囊按钮距离顶部的距离
			};
		},
		
		selectedTemplate() {
			// 确保templates数组不为空，并且有有效的模板数据
			if (!this.templates || this.templates.length === 0) {
				return {
					id: 1,
					title: '默认模板',
					image: '/static/images/tabbar/kefu.png',
					modelId: 'mt_1953340127516041216'
				};
			}
			
			const found = this.templates.find(t => t.id === this.selectedTemplateId);
			return found || this.templates[0];
		},
		
			// 判断是否显示"查看原图"按钮
	shouldShowViewOriginalButton() {
		// 检查是否已分享去水印
		const hasShared = uni.getStorageSync('photoShared');
		
		// 如果已分享去水印且当前显示的是无水印版本，不显示按钮
		if (hasShared && this.resultImageUrl === this.originalResultImageUrl) {
			return false;
		}
		
		// 只有当前显示的是水印图片（非原图）时才显示按钮
		// 如果没有原图URL或当前显示的就是原图，则隐藏按钮
		return this.originalResultImageUrl && 
			   this.resultImageUrl && 
			   this.resultImageUrl !== this.originalResultImageUrl;
	}
	},
	
	onLoad(options) {
		console.log('=== 换脸页面开始加载 ===');
		console.log('接收到的参数:', options);
		console.log('全局导航栏信息:', this.$navbar);
		console.log('全局胶囊信息:', this.$capsule);
		
		try {
			// 设置活动图片路径
			this.setActivityImagePath();
			
			// 页面加载时从缓存中获取上传的图片
			this.loadUploadedImageFromCache();
			
			// 从缓存中获取选中的模板组
			this.loadTemplateGroupFromCache();
			
			// 如果有传递templateId，设置为选中状态
			if (options.templateId) {
				this.selectedTemplateId = parseInt(options.templateId);
				console.log('设置选中模板ID:', this.selectedTemplateId);
			}
			
			// 检查是否有生成过的作品
			this.checkGeneratedWorks();
			
			console.log('当前模板数据:', this.templates);
			console.log('选中的模板:', this.selectedTemplate);
			console.log('=== 换脸页面加载完成 ===');
			
		} catch (error) {
			console.error('换脸页面加载失败:', error);
			
			// 显示错误提示
			uni.showToast({
				title: '页面加载失败',
				icon: 'error',
				duration: 3000
			});
		}
		
		// 移除页面加载时的自动弹窗
		// setTimeout(() => {
		//	this.showShareModalFlag = true;
		//	console.log('首页默认显示活动弹窗');
		// }, 500);
	},
	methods: {
		// 从缓存中加载上传的图片
		loadUploadedImageFromCache() {
			try {
				const cachedImageUrl = uni.getStorageSync('uploadedImageUrl');
				if (cachedImageUrl) {
					this.uploadedImageUrl = cachedImageUrl;
					console.log('从缓存中加载上传的图片:', cachedImageUrl);
				}
			} catch (error) {
				console.error('加载缓存图片失败:', error);
			}
		},
		
		// 从缓存中加载选中的模板组
		loadTemplateGroupFromCache() {
			try {
				const templateGroup = uni.getStorageSync('selectedTemplateGroup');
				if (templateGroup) {
					console.log(' 从缓存中加载模板组:', templateGroup);
					
					// 优先使用 templateImages，如果没有则使用 images
					let imageData = [];
					
					if (templateGroup.templateImages && templateGroup.templateImages.length > 0) {
						// 使用新的 templateImages 格式（包含 modelId）
						imageData = templateGroup.templateImages;
						console.log('✅ 使用 templateImages 数据:', imageData);
					} else if (templateGroup.images && templateGroup.images.length > 0) {
						// 兼容旧的 images 格式
						imageData = templateGroup.images.map((imageItem, index) => {
							if (typeof imageItem === 'string') {
								// 字符串格式，需要生成 modelId
								const fallbackModelIds = [
									'mt_1953340127516041216',
									'mt_1953340138781941760',
									'mt_1953340144985317376',
									'mt_1953340154955177984'
								];
								return {
									url: imageItem,
									modelId: fallbackModelIds[index % fallbackModelIds.length]
								};
							} else {
								// 对象格式
								return imageItem;
							}
						});
						console.log('⚠️ 使用兼容的 images 数据:', imageData);
					}
					
					if (imageData.length > 0) {
						// 根据imageData生成templates
						this.templates = imageData.map((imageItem, index) => {
							return {
								id: templateGroup.id * 100 + index + 1, // 生成唯一ID
								title: `${templateGroup.title}${imageData.length > 1 ? ` (${index + 1}/${imageData.length})` : ''}`,
								image: imageItem.url,
								points: templateGroup.points || 10,
								modelId: imageItem.modelId
							};
						});
						
						// 设置默认选中第一个模板
						this.selectedTemplateId = this.templates[0].id;
						console.log('✅ 已生成模板数据:', this.templates);
						console.log('✅ 已设置默认选中模板:', this.templates[0]);
						
						// 模板加载完成后检查作品
						this.$nextTick(() => {
							this.checkGeneratedWorks();
						});
					} else {
						console.log('❌ 模板组数据中没有找到有效的图片数据');
						this.useDefaultTemplates();
					}
				} else {
					// 如果没有缓存，使用默认模板
					console.log('❌ 没有找到模板组缓存，使用默认模板');
					this.useDefaultTemplates();
				}
			} catch (error) {
				console.error('❌ 加载模板组缓存失败:', error);
				this.useDefaultTemplates();
			}
		},
		
		// 使用默认模板
		useDefaultTemplates() {
			this.selectedTemplateId = 2; // 默认选择第二个模板（泉州簪花）
			console.log(' 已切换到默认模板，ID:', this.selectedTemplateId);
		},
		

		
		// 保存上传的图片到缓存
		saveUploadedImageToCache(imageUrl) {
			try {
				uni.setStorageSync('uploadedImageUrl', imageUrl);
				console.log('图片URL已保存到缓存:', imageUrl);
			} catch (error) {
				console.error('保存图片URL到缓存失败:', error);
			}
		},
		
		goBack() {
			uni.navigateBack();
		},
		
		selectTemplate(template) {
			// 如果选择的是当前模板，不做任何操作
			if (this.selectedTemplateId === template.id) {
				return;
			}
			
			console.log('切换到模板:', {
				id: template.id,
				title: template.title,
				image: template.image,
				modelId: template.modelId
			});
			
			// 直接切换模板，无动画效果
			this.selectedTemplateId = template.id;
			console.log('模板切换完成，当前选中:', this.selectedTemplate);
			
			// 切换模板后重新检查作品
			this.checkGeneratedWorks();
		},
		
		// 图片加载完成后的回调
		onImageLoad() {
			// 图片加载完成后，重置切换状态，创建淡入效果
			setTimeout(() => {
				this.isImageChanging = false;
			}, 50);
		},
		
		async uploadPhoto() {
			try {
				// 显示选择方式
				const actionResult = await new Promise((resolve, reject) => {
					uni.showActionSheet({
						itemList: ['拍照', '从相册选择'],
						success: resolve,
						fail: reject
					});
				});

				// 根据选择设置来源类型
				let sourceType = ['album'];
				if (actionResult.tapIndex === 0) {
					sourceType = ['camera'];
				}

				// 调用封装的上传方法
				const uploadResult = await chooseAndUploadImage({
					count: 1,
					sourceType: sourceType,
					onProgress: (progress) => {
						console.log('上传进度:', progress + '%');
					}
				});

				console.log('上传结果:', uploadResult);

				if (uploadResult && uploadResult.success) {
					// 保存上传的图片URL
					this.uploadedImageUrl = uploadResult.data.url;
					
					// 保存到缓存
					this.saveUploadedImageToCache(this.uploadedImageUrl);
					
					// 显示成功提示
					uni.showToast({
						title: '照片上传成功！',
						icon: 'success',
						duration: 2000
					});
					
					console.log('✅ 上传成功，当前uploadedImageUrl:', this.uploadedImageUrl);
					
					// 强制刷新组件状态，确保图片显示
					this.$forceUpdate();
					
					// 延迟一点再检查图片是否加载成功
					setTimeout(() => {
						console.log(' 上传按钮当前图片URL:', this.uploadedImageUrl);
					}, 100);
					
					// 这里可以添加后续处理逻辑，比如调用AI换脸接口
					// await this.callFaceSwapAPI();
					
				} else {
					// 上传失败
					const errorMsg = uploadResult ? uploadResult.error : '上传失败';
					uni.showToast({
						title: errorMsg,
						icon: 'error',
						duration: 3000
					});
				}
				
			} catch (error) {
				console.error('上传照片失败:', error);
				
				// 用户取消选择
				if (error.errMsg && error.errMsg.includes('cancel')) {
					return;
				}
				
				// 其他错误
				uni.showToast({
					title: '操作失败，请重试',
					icon: 'error',
					duration: 3000
				});
			}
		},
		
		// 显示分享活动弹窗
		showShareModal() {
			console.log('点击立即生成，显示分享弹窗');
			console.log('showShareModalFlag 当前状态:', this.showShareModalFlag);
			this.showShareModalFlag = true;
			console.log('showShareModalFlag 设置后状态:', this.showShareModalFlag);
		},
		
		// 关闭分享活动弹窗
		closeShareModal() {
			this.showShareModalFlag = false;
		},
		
		// 图片加载成功
		onImageLoad(e) {
			console.log('活动图片加载成功', e);
			console.log('图片路径:', this.activityImagePath);
			this.imageLoadFailed = false;
		},
		
		// 图片加载失败
		onImageError(e) {
			console.log('活动图片加载失败', e);
			console.log('尝试的图片路径:', this.activityImagePath);
			this.imageLoadFailed = true;
			// 尝试其他路径
			this.tryAlternativePaths();
		},
		
		// 尝试其他图片路径
		tryAlternativePaths() {
			console.log('尝试其他路径...');
			// 尝试不同的路径格式
			const paths = [
				'https://cdn.zhzfpn.cn/PicGo/20250830221404597.png',
				'.https://cdn.zhzfpn.cn/PicGo/20250830221404597.png',
				'..https://cdn.zhzfpn.cn/PicGo/20250830221404597.png',
				'../..https://cdn.zhzfpn.cn/PicGo/20250830221404597.png',
				'https://cdn.zhzfpn.cn/PicGo/20250830221404597.png'
			];
			
			// 随机尝试一个新路径
			const randomPath = paths[Math.floor(Math.random() * paths.length)];
			console.log('尝试新路径:', randomPath);
			this.activityImagePath = randomPath;
		},
		
		// 设置活动图片路径
		setActivityImagePath() {
			// 获取当前页面路径作为参考
			const pages = getCurrentPages();
			const currentPage = pages[pages.length - 1];
			console.log('当前页面路径:', currentPage.route);
			
			// 使用本地图片
			this.activityImagePath = 'https://cdn.zhzfpn.cn/PicGo/20250830221404597.png';
			console.log('设置活动图片路径:', this.activityImagePath);
		},
		

		
		// 参与活动
		joinActivity() {
			console.log('点击参与活动');
			
			// 关闭活动弹窗
			this.closeShareModal();
			
			// 显示参与成功提示
			uni.showToast({
				title: '欢迎参与活动！',
				icon: 'success',
				duration: 2000
			});
			
			console.log('活动参与成功，用户可以开始使用功能');
		},
		
		// 支付9.9元并分享到朋友圈
		payAndShareToMoments() {
			console.log('点击支付并分享到朋友圈');
			
			// 显示支付确认弹窗
			uni.showModal({
				title: '支付确认',
				content: '支付9.9元解锁换脸功能，并分享到朋友圈获取精酿啤酒兑换券？',
				confirmText: '立即支付',
				cancelText: '取消',
				success: (res) => {
					if (res.confirm) {
						this.processPayment();
					}
				}
			});
		},

		// 处理支付流程
		processPayment() {
			console.log('开始处理支付');
			
			// 显示支付加载状态
			uni.showLoading({
				title: '正在支付...',
				mask: true
			});
			
			// 模拟支付过程（这里需要集成真实的支付接口）
			setTimeout(() => {
				uni.hideLoading();
				
				// 支付成功后分享到朋友圈
				this.shareToWeChatMomentsAfterPayment();
			}, 2000);
		},

		// 支付成功后分享到朋友圈
		shareToWeChatMomentsAfterPayment() {
			// 分享到微信朋友圈
			uni.share({
				provider: 'weixin',
				scene: 'WXSceneTimeline',
				type: 1,
				title: 'AI旅拍活动 - 我的专属写真',
				summary: '支付9.9元解锁换脸功能，分享即可获得精酿啤酒兑换券！',
				imageUrl: 'https://cdn.zhzfpn.cn/PicGo/20250830221404597.png',
				success: (res) => {
					console.log('支付后分享朋友圈成功:', res);
					this.hasShared = true;
					
					// 显示成功提示和奖励信息
					uni.showModal({
						title: '分享成功',
						content: '恭喜您！支付成功并完成分享，已获得精酿啤酒兑换券！现在开始生成您的专属写真。',
						showCancel: false,
						confirmText: '开始生成',
						success: () => {
							// 关闭分享弹窗并开始生成
							this.closeShareModal();
							this.generatePhoto();
						}
					});
				},
				fail: (err) => {
					console.error('支付后分享朋友圈失败:', err);
					
					// 支付成功但分享失败的处理
					uni.showModal({
						title: '支付成功',
						content: '支付已成功，但分享失败。您仍可以继续生成写真，请稍后手动分享获取精酿啤酒兑换券。',
						showCancel: false,
						confirmText: '继续生成',
						success: () => {
							this.hasShared = true;
							this.closeShareModal();
							this.generatePhoto();
						}
					});
				}
			});
		},
		
		// 兼容旧的分享方法
		shareToWeChat() {
			// 默认分享到好友
			this.shareToWeChatFriends();
		},
		
		async generatePhoto() {
			// 检查是否已上传照片
			console.log('当前上传的图片URL:', this.uploadedImageUrl);
			
			if (!this.uploadedImageUrl) {
				uni.showModal({
					title: '提示',
					content: '请先上传您的照片',
					showCancel: false,
					confirmText: '知道了'
				});
				return;
			}

			// 检查是否正在生成中
			if (this.isGenerating) {
				uni.showToast({
					title: '正在生成中，请稍候',
					icon: 'none',
					duration: 2000
				});
				return;
			}

			uni.showModal({
				title: '生成AI写真',
				content: `确认使用「${this.selectedTemplate.title}」模板生成AI写真吗？`,
				confirmText: '立即生成',
				cancelText: '取消',
				success: async (res) => {
					if (res.confirm) {
						try {
							// 设置生成状态
							this.isGenerating = true;
							
							uni.showLoading({
								title: '正在生成中...',
								mask: true
							});
							
							// 调用AI换脸接口
							const result = await this.callFaceSwapAPI();
							
							uni.hideLoading();
							
							// 处理生成结果
							this.handleGenerationResult(result);
							
						} catch (error) {
							uni.hideLoading();
							console.error('生成失败:', error);
							
							const errorMsg = error && error.message ? error.message : '生成失败，请重试';
							uni.showToast({
								title: errorMsg,
								icon: 'error',
								duration: 3000
							});
						} finally {
							// 重置生成状态
							this.isGenerating = false;
						}
					}
				}
			});
		},

		// 调用AI换脸接口
		async callFaceSwapAPI() {
			try {
				// 检查用户图片URL
				if (!this.uploadedImageUrl) {
					throw new Error('用户图片URL不能为空');
				}

				// 详细的调试信息
				console.log('=== 换脸调试信息 ===');
				console.log('当前选中模板ID:', this.selectedTemplateId);
				console.log('可用模板总数:', this.templates.length);
				console.log('所有模板:', this.templates.map(t => ({
					id: t.id,
					title: t.title,
					modelId: t.modelId,
					hasImage: !!t.image
				})));
				console.log('选中的模板对象:', this.selectedTemplate);
				
				// 验证模板数据完整性
				if (!this.selectedTemplate) {
					throw new Error('未找到选中的模板');
				}
				
				if (!this.selectedTemplate.image) {
					throw new Error('模板图片URL不能为空');
				}

				// 检查素材ID
				if (!this.selectedTemplate.modelId) {
					console.error('模板缺少modelId:', this.selectedTemplate);
					throw new Error(`素材ID不能为空。模板ID: ${this.selectedTemplate.id}, 标题: ${this.selectedTemplate.title}`);
				}

				// 验证modelId格式
				if (!this.selectedTemplate.modelId.startsWith('mt_')) {
					console.warn('ModelId格式可能不正确:', this.selectedTemplate.modelId);
				}

				console.log('=== 开始换脸操作 ===');
				console.log('用户图片:', this.uploadedImageUrl);
				console.log('素材ID:', this.selectedTemplate.modelId);
				console.log('模板标题:', this.selectedTemplate.title);
				console.log('请求参数:', {
					source_image: this.uploadedImageUrl,
					model_id: this.selectedTemplate.modelId,
					templateId: this.selectedTemplate.id,
					templateTitle: this.selectedTemplate.title
				});

				// 调用换脸接口
				const result = await swapFace(
					this.uploadedImageUrl, // 用户图片URL
					this.selectedTemplate.modelId, // 素材ID
					{
						templateId: this.selectedTemplate.id,
						templateTitle: this.selectedTemplate.title,
						templateImageUrl: this.selectedTemplate.image, // 添加模板图片URL
						templateImage: this.selectedTemplate.image // 兼容性参数
					}
				);

				console.log('=== 换脸接口返回结果 ===');
				console.log('结果:', result);
				return result;

			} catch (error) {
				console.error('=== 调用换脸接口失败 ===');
				console.error('错误类型:', error.constructor.name);
				console.error('错误消息:', error.message);
				console.error('错误堆栈:', error.stack);
				
				// 返回错误结果而不是抛出异常
				return {
					success: false,
					error: error.message || '换脸失败'
				};
			}
		},

		// 处理生成结果
		handleGenerationResult(result) {
			console.log('处理生成结果:', result);
			
			if (result && result.success) {
				// 换脸成功
				this.swapResult = result.data;
				
				uni.showToast({
					title: '换脸成功！',
					icon: 'success',
					duration: 2000
				});

				console.log('换脸成功，结果:', result.data);
				
				// 这里可以添加结果展示逻辑
				// 比如跳转到结果页面或显示结果弹窗
				this.showSwapResult(result.data);
				
			} else {
				// 换脸失败
				const errorMsg = result && result.error ? result.error : '换脸失败';
				uni.showToast({
					title: errorMsg,
					icon: 'error',
					duration: 3000
				});

				console.error('换脸失败:', errorMsg);
			}
		},

		// 显示换脸结果
		showSwapResult(resultData) {
			console.log('显示换脸结果:', resultData);
			
			// 获取换脸结果图片URL
			let resultImageUrl = resultData.result_image;
			
			if (!resultImageUrl) {
				uni.showToast({
					title: '换脸结果图片获取失败',
					icon: 'error',
					duration: 3000
				});
				return;
			}
			
			// 保存原始结果图片URL（用于去除水印）
			this.originalResultImageUrl = resultImageUrl;
			
			try {
				// 获取用户信息
				const userInfo = getUserInfo();
				
				// 生成带文字水印的图片URL
				// 统一使用固定的水印文字"我为村BA代言"
				console.log('添加固定水印文字: 我为村BA代言');
				resultImageUrl = generateSimpleTextWatermark(resultImageUrl, '我为村BA代言');
			} catch (error) {
				console.error('添加文字水印失败，使用原图:', error);
				// 水印添加失败，使用原图
				resultImageUrl = this.originalResultImageUrl;
			}
			
			// 保存生成的作品到缓存（保存带水印的URL）
			const watermarkedResultData = {
				...resultData,
				result_image: resultImageUrl,
				original_result_image: resultData.result_image // 保留原图URL
			};
			this.saveGeneratedWorkToCache(watermarkedResultData);
			
			// 设置结果图片URL并显示弹窗
			this.resultImageUrl = resultImageUrl;
			this.openResultModal();
		},

		// 显示结果弹窗
		openResultModal() {
			// 显示成功提示
			uni.showToast({
				title: '换脸成功！',
				icon: 'success',
				duration: 2000
			});
			
			// 显示结果弹窗
			this.showResultModal = true;
		},

		// 关闭结果弹窗
		closeResultModal() {
			this.showResultModal = false;
			this.resultImageUrl = '';
		},



		// 预览图片
		previewImage() {
			if (!this.resultImageUrl) {
				uni.showToast({
					title: '图片地址无效',
					icon: 'error',
					duration: 2000
				});
				return;
			}

			// 使用uni.previewImage预览图片
			uni.previewImage({
				current: this.resultImageUrl,
				urls: [this.resultImageUrl],
				success: () => {
					console.log('图片预览成功');
				},
				fail: (err) => {
					console.error('图片预览失败:', err);
					uni.showToast({
						title: '图片预览失败',
						icon: 'error',
						duration: 2000
					});
				}
			});
		},

		// 去除水印
		removeWatermark() {
			console.log('点击去除水印按钮');
			
			// 关闭结果弹窗
			this.closeResultModal();
			
			// 显示分享活动弹窗来完成去除水印流程
			this.showShareModalFlag = true;
		},

		// 检查是否有生成过的作品
		checkGeneratedWorks() {
			try {
				const currentTemplate = this.selectedTemplate;
				if (!currentTemplate) {
					return;
				}
				
				// 使用模板ID和modelId作为缓存key
				const cacheKey = `generated_works_${currentTemplate.id}_${currentTemplate.modelId}`;
				const worksData = uni.getStorageSync(cacheKey);
				
				console.log('检查模板作品缓存:', cacheKey, worksData);
				
				if (worksData && worksData.length > 0) {
					this.hasGeneratedWorks = true;
					this.myWorksData = worksData;
					console.log('找到生成过的作品:', worksData.length, '张');
				} else {
					this.hasGeneratedWorks = false;
					this.myWorksData = [];
					console.log('该模板暂无生成过的作品');
				}
			} catch (error) {
				console.error('检查生成作品缓存失败:', error);
				this.hasGeneratedWorks = false;
				this.myWorksData = [];
			}
		},

			// 保存生成的作品到缓存
	saveGeneratedWorkToCache(resultData) {
		try {
			const currentTemplate = this.selectedTemplate;
			if (!currentTemplate || !resultData || !resultData.result_image) {
				console.error('保存作品失败：模板或结果数据无效');
				return;
			}
			
			const cacheKey = `generated_works_${currentTemplate.id}_${currentTemplate.modelId}`;
			
			// 检查是否已分享去水印
			const hasShared = uni.getStorageSync('photoShared');
			
			// 创建作品数据
			const workData = {
				id: Date.now(), // 使用时间戳作为唯一ID
				templateId: currentTemplate.id,
				templateTitle: currentTemplate.title,
				templateImage: currentTemplate.image,
				modelId: currentTemplate.modelId,
				resultImage: resultData.result_image,
				originalResultImage: resultData.original_result_image || resultData.result_image,
				userImage: this.uploadedImageUrl,
				createTime: new Date().toISOString(),
				timestamp: Date.now(),
				watermarkRemoved: hasShared // 记录水印是否已被去除
			};
			
			// 获取现有的作品列表
			let existingWorks = uni.getStorageSync(cacheKey) || [];
			
			// 添加新作品到列表开头
			existingWorks.unshift(workData);
			
			// 限制最多保存10张作品
			if (existingWorks.length > 10) {
				existingWorks = existingWorks.slice(0, 10);
			}
			
			// 保存到缓存
			uni.setStorageSync(cacheKey, existingWorks);
			
			// 更新当前页面状态
			this.myWorksData = existingWorks;
			this.hasGeneratedWorks = true;
			
			console.log('作品已保存到缓存:', cacheKey, workData);
			
		} catch (error) {
			console.error('保存生成作品到缓存失败:', error);
		}
	},

			// 查看我的作品
	viewMyWorks() {
		console.log('查看我的作品，共', this.myWorksData.length, '张');
		
		if (this.myWorksData.length === 0) {
			uni.showToast({
				title: '暂无作品',
				icon: 'none',
				duration: 2000
			});
			return;
		}
		
		// 添加触觉反馈
		uni.vibrateShort({
			type: 'light'
		});
		
		// 跳转到我的相册页面
		uni.navigateTo({
			url: '/pages/ai-trip/my_photo/index?source=faceswap&category=portrait',
			animationType: 'slide-in-right',
			success: () => {
				console.log('成功跳转到我的相册页面');
			},
			fail: (err) => {
				console.error('跳转到我的相册页面失败:', err);
				
				// 跳转失败时，回退到原来的显示最新作品的逻辑
				this.showLatestWork();
			}
		});
	},
	
	// 显示最新作品（从原来的viewMyWorks方法中提取的逻辑）
	showLatestWork() {
		// 显示最新的作品
		const latestWork = this.myWorksData[0];
		if (latestWork && latestWork.resultImage) {
			// 检查是否已去水印
			if (latestWork.watermarkRemoved && latestWork.originalResultImage) {
				// 已去水印，直接显示无水印版本
				this.resultImageUrl = latestWork.originalResultImage;
				console.log('显示已去水印的作品');
			} else {
				// 未去水印，显示带水印版本
				this.resultImageUrl = latestWork.resultImage;
			}
			
			// 确保原始图片URL也被设置，以便支持去水印功能
			if (latestWork.originalResultImage) {
				this.originalResultImageUrl = latestWork.originalResultImage;
			} else {
				// 如果没有原始图片URL，就使用结果图片URL
				this.originalResultImageUrl = latestWork.resultImage;
			}
			
			this.openResultModal();
			
			console.log('显示最新作品:', latestWork);
		} else {
			uni.showToast({
				title: '作品数据异常',
				icon: 'error',
				duration: 2000
			});
		}
	},

		// 上传头像图片加载成功
		onUploadImageLoad() {
			console.log('上传头像图片加载成功:', this.uploadedImageUrl);
		},

		// 上传头像图片加载失败（暂时注释)
		// onUploadImageError(e) {
		// 	console.error('上传头像图片加载失败:', e, this.uploadedImageUrl);
		// 	uni.showToast({
		// 		title: '头像图片加载失败',
		// 		icon: 'none',
		// 		duration: 2000
		// 	});
		// },

			// 添加查看原图功能
	viewOriginalImage() {
		console.log('点击查看原图按钮');
		
		if (!this.originalResultImageUrl) {
			uni.showToast({
				title: '原图不存在',
				icon: 'error',
				duration: 2000
			});
			return;
		}
		
		// 检查是否已经分享过
		const hasShared = uni.getStorageSync('photoShared');
		if (hasShared) {
			// 已分享过，直接显示无水印版本
			this.resultImageUrl = this.originalResultImageUrl;
			uni.showToast({
				title: '已显示无水印版本',
				icon: 'success',
				duration: 1500
			});
		} else {
			// 未分享过，显示分享提示
			uni.showModal({
				title: '去除水印',
				content: '分享给好友即可免费去除水印，是否立即分享？',
				confirmText: '立即分享',
				cancelText: '取消',
				success: (res) => {
					if (res.confirm) {
						// 设置分享标记，在onShareAppMessage中会使用
						this.pendingShare = true;
						
						// 关闭当前弹窗，让用户直接看到分享按钮
						uni.showToast({
							title: '请使用分享按钮',
							icon: 'none',
							duration: 1000
						});
					}
				}
			});
		}
	},
		
		// 在 methods 对象内部的最后添加这个方法
		onShareSuccess() {
			console.log('分享成功，设置分享标记');
			uni.setStorageSync('photoShared', true);
			
			// 可以在这里添加分享成功后的逻辑
			uni.showToast({
				title: '分享成功',
				icon: 'success',
				duration: 1500
			});
		},
		
		// 关闭奖励弹窗
		closeRewardDialog() {
			this.showRewardDialog = false;
		},
		
		// 保存二维码到相册
		saveQrcode() {
			uni.showLoading({
				title: '保存中...'
			});
			
			// 检查授权状态
			uni.getSetting({
				success: (res) => {
					if (res.authSetting['scope.writePhotosAlbum']) {
						// 已授权，直接保存
						this.downloadAndSaveImage();
					} else {
						// 未授权，请求授权
						uni.authorize({
							scope: 'scope.writePhotosAlbum',
							success: () => {
								// 授权成功，保存图片
								this.downloadAndSaveImage();
							},
							fail: (err) => {
								uni.hideLoading();
								console.error('授权失败:', err);
								
								// 用户拒绝授权，引导用户打开设置页面
								uni.showModal({
									title: '提示',
									content: '保存图片需要您授权保存到相册的权限',
									confirmText: '去设置',
									cancelText: '取消',
									success: (res) => {
										if (res.confirm) {
											uni.openSetting({
												success: (settingRes) => {
													console.log('设置页面返回:', settingRes);
													if (settingRes.authSetting['scope.writePhotosAlbum']) {
														// 用户在设置页面授权了，重新保存
														this.downloadAndSaveImage();
													}
												}
											});
										}
									}
								});
							}
						});
					}
				},
				fail: (err) => {
					uni.hideLoading();
					console.error('获取授权状态失败:', err);
					uni.showToast({
						title: '获取授权状态失败',
						icon: 'none',
						duration: 2000
					});
				}
			});
		},
		
		// 下载并保存图片
		downloadAndSaveImage() {
			// 先下载网络图片到本地临时路径
			uni.downloadFile({
				url: this.qrcodeImage,
				success: (res) => {
					if (res.statusCode === 200) {
						// 下载成功，保存到相册
						uni.saveImageToPhotosAlbum({
							filePath: res.tempFilePath,
							success: () => {
								uni.hideLoading();
								this.showSaveSuccess = true;
								
								// 3秒后隐藏保存成功提示
								setTimeout(() => {
									this.showSaveSuccess = false;
								}, 3000);
							},
							fail: (err) => {
								uni.hideLoading();
								console.error('保存图片失败:', err);
								
								uni.showToast({
									title: '保存图片失败',
									icon: 'none',
									duration: 2000
								});
							}
						});
					} else {
						uni.hideLoading();
						console.error('下载图片失败，状态码:', res.statusCode);
						
						uni.showToast({
							title: '下载图片失败',
							icon: 'none',
							duration: 2000
						});
					}
				},
				fail: (err) => {
					uni.hideLoading();
					console.error('下载图片失败:', err);
					
					uni.showToast({
						title: '下载图片失败',
						icon: 'none',
						duration: 2000
					});
				}
			});
		},
		
		// 准备去水印分享
		prepareWatermarkShare() {
			console.log('准备去水印分享 - 已改为付费去水印');
			
			// 调用付费去水印方法
			this.payToRemoveWatermark();
		},

		// 付费去水印
		payToRemoveWatermark() {
			console.log('点击付费去水印按钮');
			
			if (!this.originalResultImageUrl) {
				uni.showToast({
					title: '原图不存在',
					icon: 'error',
					duration: 2000
				});
				return;
			}
			
			// 检查用户登录状态
			if (!isLoggedIn()) {
				const token = uni.getStorageSync('token');
				uni.showToast({
					title: 'token:' + token,
					icon: 'none',
					duration: 2000
				});
				uni.showModal({
					title: '需要登录',
					content: '支付前需要先登录，是否立即登录？',
					confirmText: '立即登录',
					cancelText: '取消',
					success: (res) => {
						if (res.confirm) {
							// 跳转到登录页面
							uni.navigateTo({
								url: '/pages/users/wechat_login/index'
							});
						}
					}
				});
				return;
			}
			
			// 显示确认支付弹窗
			uni.showModal({
				title: '去除水印',
				content: '支付0.01元即可去除水印，确认支付吗？',
				confirmText: '确认支付',
				cancelText: '取消',
				success: (res) => {
					if (res.confirm) {
						this.processPaymentForWatermark();
					}
				}
			});
		},

			// 处理水印支付流程
	processPaymentForWatermark() {
		// 显示加载状态
		uni.showLoading({
			title: '处理支付...',
			mask: true
		});
		
		// 验证用户登录状态
		const token = uni.getStorageSync('token');
		if (!token) {
			uni.hideLoading();
			uni.showModal({
				title: '登录已过期',
				content: '请重新登录后再进行支付',
				showCancel: false,
				confirmText: '重新登录',
				success: () => {
					uni.navigateTo({
						url: '/pages/users/wechat_login/index'
					});
				}
			});
			return;
		}
		
		// 先获取有效的套餐ID，然后创建订单
		this.getValidPackageForPayment()
			.then(packageId => {
				console.log('获取到有效套餐ID:', packageId);
				
				console.log('开始创建支付订单:', {
					package_id: packageId,
					amount: 0.01,
					description: '去除水印服务费',
					token: token ? 'exists' : 'missing'
				});
				
				// 创建订单
				return createRechargeOrder({
					package_id: packageId,
					amount: 0.01, // 固定金额0.01元
					description: '去除水印服务费'
				});
			})
			.then(orderResult => {
				console.log('创建订单成功:', orderResult);
				
				// 检查返回结果的结构
				if (!orderResult) {
					throw new Error('创建订单失败：返回结果为空');
				}
				
				// 支持不同的返回数据结构
				let orderNo;
				if (orderResult.data && orderResult.data.order_no) {
					orderNo = orderResult.data.order_no;
				} else if (orderResult.order_no) {
					orderNo = orderResult.order_no;
				} else if (orderResult.data && orderResult.data.orderNo) {
					orderNo = orderResult.data.orderNo;
				} else {
					console.error('订单返回结构:', orderResult);
					throw new Error('创建订单失败：未获取到订单号');
				}
				
				console.log('获取到订单号:', orderNo);
				
				// 获取支付参数
				return getPayParams({
					order_no: orderNo
				});
			})
			.then(payResult => {
				console.log('获取支付参数成功:', payResult);
				uni.hideLoading();
				
				// 检查支付参数
				if (!payResult || !payResult.data) {
					throw new Error('获取支付参数失败：返回数据为空');
				}
				
				// 根据不同平台调用不同的支付接口
				// #ifdef MP-WEIXIN
				this.wxPay(payResult.data);
				// #endif
				
				// #ifdef H5
				this.h5Pay(payResult.data);
				// #endif
				
				// #ifdef APP-PLUS
				this.appPay(payResult.data);
				// #endif
			})
			.catch(error => {
				uni.hideLoading();
				console.error('支付过程出错:', error);
				
				// 根据错误类型显示不同的提示信息
				let errorMessage = '支付失败，请重试';
				
				if (error.message) {
					if (error.message.includes('token') || error.message.includes('登录')) {
						errorMessage = '登录状态异常，请重新登录';
					} else if (error.message.includes('套餐') || error.message.includes('package')) {
						errorMessage = '支付套餐配置错误，请联系客服';
					} else if (error.message.includes('网络') || error.message.includes('timeout')) {
						errorMessage = '网络连接异常，请检查网络后重试';
					} else {
						errorMessage = error.message;
					}
				}
				
				uni.showModal({
					title: '支付失败',
					content: errorMessage,
					showCancel: true,
					confirmText: '重试',
					cancelText: '取消',
					success: (res) => {
						if (res.confirm) {
							// 用户选择重试
							setTimeout(() => {
								this.processPaymentForWatermark();
							}, 1000);
						}
					}
				});
			})
			.catch(error => {
				uni.hideLoading();
				console.error('获取套餐失败:', error);
				
				uni.showModal({
					title: '获取套餐失败',
					content: '无法获取支付套餐信息，请稍后重试',
					showCancel: true,
					confirmText: '重试',
					cancelText: '取消',
					success: (res) => {
						if (res.confirm) {
							setTimeout(() => {
								this.processPaymentForWatermark();
							}, 1000);
						}
					}
				});
			});
		},
		
		// 获取有效的套餐ID用于支付
		getValidPackageForPayment() {
			return new Promise((resolve, reject) => {
				// 首先尝试获取套餐列表
				getCreditPackages()
					.then(result => {
						console.log('套餐列表响应:', result);
						
						// 处理不同的响应格式
						let packages = [];
						if (result.data && Array.isArray(result.data)) {
							packages = result.data;
						} else if (result.code === 200 && result.data) {
							packages = Array.isArray(result.data) ? result.data : [];
						} else if (Array.isArray(result)) {
							packages = result;
						}
						
						console.log('解析出的套餐列表:', packages);
						
						if (packages.length > 0) {
							// 查找最小金额的套餐，优先选择0.01元的套餐
							const targetPackage = packages.find(pkg => {
								const price = pkg.price || pkg.amount || 0;
								return price === 0.01;
							}) || packages[0]; // 如果没有0.01元套餐，选择第一个
							
							console.log('选择的套餐:', targetPackage);
							resolve(targetPackage.id || targetPackage.package_id || 1);
						} else {
							// 没有套餐，使用默认ID
							console.warn('没有获取到套餐列表，使用默认套餐ID');
							resolve(1);
						}
					})
					.catch(error => {
						console.error('获取套餐列表失败:', error);
						// 获取套餐失败，使用默认套餐ID
						console.warn('获取套餐列表失败，使用默认套餐ID');
						resolve(1);
					});
			});
		},

		// 微信小程序支付
		wxPay(payParams) {
			console.log('微信小程序支付参数:', payParams);
			
			// 验证必要的支付参数
			const requiredParams = ['timeStamp', 'nonceStr', 'package', 'signType', 'paySign'];
			const missingParams = requiredParams.filter(param => !payParams[param]);
			
			if (missingParams.length > 0) {
				console.error('缺少支付参数:', missingParams);
				uni.showToast({
					title: `缺少支付参数: ${missingParams.join(', ')}`,
					icon: 'none',
					duration: 3000
				});
				return;
			}
			
			// 实际支付
			uni.requestPayment({
				...payParams,
				success: (res) => {
					console.log('支付成功', res);
					this.handlePaymentSuccess();
				},
				fail: (err) => {
					console.error('支付失败', err);
					
					// 根据错误类型显示不同提示
					let errorMessage = '支付失败';
					if (err.errMsg) {
						if (err.errMsg.includes('cancel')) {
							errorMessage = '用户取消支付';
						} else if (err.errMsg.includes('fail')) {
							errorMessage = '支付失败，请重试';
						} else {
							errorMessage = err.errMsg;
						}
					}
					
					uni.showToast({
						title: errorMessage,
						icon: 'none',
						duration: 2000
					});
				}
			});
		},

		// H5支付
		h5Pay(payParams) {
			console.log('H5支付参数:', payParams);
			
			if (payParams.mweb_url) {
				console.log('跳转到H5支付页面:', payParams.mweb_url);
				window.location.href = payParams.mweb_url;
			} else {
				console.error('H5支付参数缺少mweb_url:', payParams);
				uni.showToast({
					title: '获取支付链接失败',
					icon: 'none',
					duration: 2000
				});
			}
		},

		// APP支付
		appPay(payParams) {
			console.log('APP支付参数:', payParams);
			
			uni.requestPayment({
				provider: 'wxpay', // 或者 'alipay'
				orderInfo: payParams, // 微信、支付宝订单数据
				success: (res) => {
					console.log('支付成功', res);
					this.handlePaymentSuccess();
				},
				fail: (err) => {
					console.error('支付失败', err);
					
					// 根据错误类型显示不同提示
					let errorMessage = '支付失败';
					if (err.errMsg) {
						if (err.errMsg.includes('cancel')) {
							errorMessage = '用户取消支付';
						} else if (err.errMsg.includes('fail')) {
							errorMessage = '支付失败，请重试';
						} else {
							errorMessage = err.errMsg;
						}
					}
					
					uni.showToast({
						title: errorMessage,
						icon: 'none',
						duration: 2000
					});
				}
			});
		},

		// 处理支付成功
		handlePaymentSuccess() {
			// 设置已支付标记
			uni.setStorageSync('photoShared', true);
			
			// 显示无水印版本
			this.resultImageUrl = this.originalResultImageUrl;
			
			// 显示成功提示
			uni.showToast({
				title: '支付成功，水印已去除',
				icon: 'success',
				duration: 2000
			});
			
			// 更新本地存储的作品数据，标记为已去除水印
			this.updateWorkWatermarkStatus();
			
			// 关闭结果弹窗
			this.closeResultModal();
			
			// 显示活动弹窗
			setTimeout(() => {
				this.showShareModalFlag = true;
				console.log('支付成功后显示活动弹窗');
			}, 500);
		},

		// 更新作品水印状态
		updateWorkWatermarkStatus() {
			try {
				const currentTemplate = this.selectedTemplate;
				if (!currentTemplate) {
					return;
				}
				
				// 使用模板ID和modelId作为缓存key
				const cacheKey = `generated_works_${currentTemplate.id}_${currentTemplate.modelId}`;
				let existingWorks = uni.getStorageSync(cacheKey) || [];
				
				// 找到当前作品并更新状态
				const updatedWorks = existingWorks.map(work => {
					if (work.resultImage === this.resultImageUrl || 
						work.originalResultImage === this.originalResultImageUrl) {
						return {
							...work,
							watermarkRemoved: true
						};
					}
					return work;
				});
				
				// 保存到缓存
				uni.setStorageSync(cacheKey, updatedWorks);
				console.log('作品水印状态已更新');
				
			} catch (error) {
				console.error('更新作品水印状态失败:', error);
			}
		},
		
		// 处理分享获取兑换券
		handleShareForReward() {
			console.log('点击分享获取兑换券');
			// 设置分享标记，以便在分享成功回调中显示兑换券弹窗
			uni.setStorageSync('hasShared', true);
		},

		// 添加查看收藏方法
		viewFavorites() {
			console.log('查看收藏');
			
			// 添加触觉反馈
			uni.vibrateShort({
				type: 'light'
			});
			
			// 跳转到收藏页面
			uni.navigateTo({
				url: '/pages/ai-trip/my_photo/favorites',
				animationType: 'slide-in-right',
				success: () => {
					console.log('成功跳转到收藏页面');
				},
				fail: (err) => {
					console.error('跳转到收藏页面失败:', err);
					uni.showToast({
						title: '页面跳转失败，请重试',
						icon: 'none',
						duration: 2000
					});
				}
			});
		},
	},
	
	// 添加 onShareAppMessage 生命周期函数，与 methods 同级
	onShareAppMessage(res) {
		console.log('触发分享', res);
		
		// 检查是否是兑换券分享
		let shareTitle, shareDesc, sharePath, shareImageUrl;
		
		if (this.showShareModalFlag) {
			// 兑换券分享
			shareTitle = `我参与了村BA活动，快来领取精酿啤酒兑换券！`;
			shareDesc = '分享即可获得精酿啤酒兑换券，快来体验！';
			sharePath = '/pages/ai-trip/index/index?source=activity';
			shareImageUrl = 'https://cdn.zhzfpn.cn/PicGo/20250830221404597.png';
			console.log('这是兑换券的分享');
			
			// 设置分享标记，以便在onShow中显示兑换券弹窗
			uni.setStorageSync('hasShared', true);
		} else if (this.pendingShare) {
			// 去水印分享
			shareTitle = `我用AI换脸生成了一张照片，分享即可去除水印！`;
			shareDesc = '分享后自动去除水印，快来体验！';
			sharePath = '/pages/ai-trip/index/index?source=faceswap';
			shareImageUrl = this.resultImageUrl;
			console.log('这是去水印的分享');
			
			// 设置去水印分享标记
			uni.setStorageSync('photoShared', true);
		} else {
			// 普通分享
			shareTitle = `我用AI换脸生成了一张${this.selectedTemplate?.title || 'AI写真'}，快来体验吧！`;
			shareDesc = '让朋友也来体验AI换脸';
			sharePath = '/pages/ai-trip/index/index?source=faceswap';
			shareImageUrl = this.resultImageUrl;
		}
		
		return {
			title: shareTitle,
			desc: shareDesc,
			path: sharePath,
			imageUrl: shareImageUrl,
			success: () => {
				// 如果是去水印分享，立即更新UI显示无水印图片
				if (this.pendingShare) {
					// 显示无水印版本
					if (this.originalResultImageUrl) {
						this.resultImageUrl = this.originalResultImageUrl;
						
						// 显示成功提示
						uni.showToast({
							title: '水印已成功去除',
							icon: 'success',
							duration: 2000
						});
					}
					
					// 重置标记
					this.pendingShare = false;
				}
				
				this.onShareSuccess();
			},
			fail: (err) => {
				console.log('分享失败', err);
				// 重置分享标记
				if (this.pendingShare) {
					this.pendingShare = false;
				}
				if (this.showShareModalFlag) {
					uni.removeStorageSync('hasShared');
				}
			}
		}
	},
	
	// 添加 onShow 生命周期函数，与 onLoad 同级
	onShow() {
		console.log('页面显示');
		
		// 检查是否有分享成功的标记
		const hasShared = uni.getStorageSync('hasShared');
		console.log('hasShared 标记:', hasShared);
		
		if (hasShared) {
			// 清除标记
			uni.removeStorageSync('hasShared');
			
			// 关闭活动弹窗
			this.closeShareModal();
			
			// 显示兑换券弹窗
			setTimeout(() => {
				this.showRewardDialog = true;
				console.log('显示兑换券弹窗');
			}, 500);
		}
		
		// 检查去水印分享标记
		const photoShared = uni.getStorageSync('photoShared');
		console.log('photoShared 标记:', photoShared);
		
		if (photoShared && this.pendingShare && this.showResultModal) {
			// 重置分享标记
			this.pendingShare = false;
			
			// 显示无水印版本
			if (this.originalResultImageUrl) {
				this.resultImageUrl = this.originalResultImageUrl;
				
				// 显示成功提示
				uni.showToast({
					title: '水印已成功去除',
					icon: 'success',
					duration: 2000
				});
			}
			
			// 清除去水印分享标记
			uni.removeStorageSync('photoShared');
		}
	},
	
	// 添加 onUnload 生命周期函数，与 onLoad 同级
	onUnload() {
		// 清除分享标记
		uni.removeStorageSync('photoShared');
		uni.removeStorageSync('hasShared');
	}
}
</script>

<style scoped>
.ai-photo-container {
	width: 100%;
	min-height: 100vh;
	background-color: #1a1a1a;
	position: relative;
	overflow: hidden;
}



/* 导航栏样式调整 - 原返回按钮样式已移除 */

/* 底部收藏按钮已删除 */

/* 我的作品按钮 */
.my-works-button {
	position: fixed;
	bottom: 370rpx; /* 调整位置避免被生成按钮遮挡 */
	right: 70rpx;
	display: flex;
	flex-direction: column;
	align-items: center;
	padding: 10rpx;
	cursor: pointer;
	transition: all 0.3s ease;
	z-index: 1001; /* 提高z-index，确保在生成按钮之上 */
	margin-bottom: env(safe-area-inset-bottom);
	/* 移除原来的黑色背景和方形边框 */
	background: transparent;
	border-radius: 50%;
	/* 移除backdrop-filter */
	backdrop-filter: none;
	-webkit-backdrop-filter: none;
	min-width: auto; /* 移除最小宽度限制，使按钮可以成为圆形 */
}

.my-works-button:active {
	transform: scale(0.95);
}

/* 新增圆形容器样式 */
.works-icon-image-only {
	width: 80rpx;
	height: 80rpx;
	border-radius: 50%;
	padding: 15rpx;
	background: white;
	position: relative;
	z-index: 2;
	border: 3rpx solid rgba(255, 255, 255, 0.8);
	box-shadow: 0 2rpx 8rpx rgba(0, 0, 0, 0.2); /* 减少阴影 */
}

/* 添加圆环效果 */
.works-button-text {
	font-size: 24rpx;
	color: white;
	font-weight: 500;
	text-align: center;
	white-space: nowrap;
	margin-top: 10rpx;
	background: rgba(0, 0, 0, 0.4); /* 降低不透明度 */
	padding: 6rpx 16rpx;
	border-radius: 20rpx;
}

/* 重新上传照片按钮 */
.upload-photo-button {
	position: fixed;
	bottom: 0rpx; /* 稍微上移，避免太贴边 */
	right: 40rpx;
	display: flex;
	flex-direction: column;
	align-items: center;
	padding: 10rpx;
	cursor: pointer;
	transition: all 0.3s ease;
	z-index: 999;
	margin-bottom: env(safe-area-inset-bottom);
}

.upload-photo-button:active .upload-avatar {
	transform: scale(0.9);
}

.upload-avatar {
	width: 100rpx;
	height: 100rpx;
	border-radius: 50%;
	border: 4rpx solid rgba(255, 255, 255, 0.8);
	transition: all 0.3s ease;
}

.avatar-border {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	border-radius: 50%;
	box-shadow: none; /* 移除所有阴影效果 */
	z-index: -1;
	/* 移除渐变背景和边框 */
	background: transparent;
	border: none;
}

/* 移除动画效果，因为已经不需要了 */
@keyframes gradientShift {
	0% { background-position: 0% 50%; }
	50% { background-position: 100% 50%; }
	100% { background-position: 0% 50%; }
}

.upload-plus {
	position: absolute;
	bottom: -10rpx;
	right: -10rpx;
	width: 40rpx;
	height: 40rpx;
	background: #7ed321;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	color: white;
	font-size: 32rpx;
	font-weight: bold;
	border: 4rpx solid white;
	box-shadow: 0 4rpx 12rpx rgba(126, 211, 33, 0.4);
}

.upload-checkmark {
	position: absolute;
	bottom: -10rpx;
	right: -10rpx;
	width: 40rpx;
	height: 40rpx;
	background: #4CAF50;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	color: white;
	font-size: 24rpx;
	font-weight: bold;
	border: 4rpx solid white;
	box-shadow: 0 4rpx 12rpx rgba(76, 175, 80, 0.4);
}

/* 主要内容区域 */
.main-content {
	height: 100vh;
	display: flex;
	flex-direction: column;
}

/* 主图展示区域 */
.main-image-section {
	flex: 1;
	position: relative;
	overflow: hidden;
}

.main-image-container {
	width: 100%;
	height: 100%;
	position: relative;
}

.main-image {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: all 0.7s cubic-bezier(0.4, 0, 0.2, 1);
	opacity: 1;
}

/* 图片切换动画 */
.main-image.fade-in {
	opacity: 0.8;
	transform: scale(1.01);
}

/* 右侧悬浮缩略图列表 */
.floating-thumbnails {
	position: absolute;
	left: 40rpx;
	top: 50%;
	transform: translateY(-50%);
	display: flex;
	flex-direction: column;
	gap: 20rpx;
	z-index: 100;
}

.thumbnail-item {
	width: 100rpx;
	height: 140rpx;
	border-radius: 12rpx 0 0 12rpx;
	overflow: hidden;
	border: 3rpx solid transparent;
	border-right: none;
	position: relative;
	transition: all 0.3s ease;
	box-shadow: 0 6rpx 18rpx rgba(0, 0, 0, 0.5);
	background-color: #2a2a2a;
}

.thumbnail-item.selected {
	border-color: #7ed321;
	transform: scale(1.05);
	box-shadow: 
		0 12rpx 32rpx rgba(126, 211, 33, 0.4),
		0 8rpx 16rpx rgba(126, 211, 33, 0.3);
}

.thumbnail-item:active {
	transform: scale(0.95);
}

.thumbnail-image {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

/* 选中指示器 */
.selected-indicator {
	position: absolute;
	top: 6rpx;
	right: 6rpx;
	width: 24rpx;
	height: 24rpx;
	background: #7ed321;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	box-shadow: 0 3rpx 9rpx rgba(126, 211, 33, 0.4);
}

.check-mark {
	color: white;
	font-size: 16rpx;
	font-weight: 700;
}



/* 悬浮生成按钮 */
.floating-generate-button {
	position: fixed;
	bottom: 60rpx;
	left: 50%;
	transform: translateX(-50%);
	display: flex;
	align-items: center;
	justify-content: center;
	background: linear-gradient(135deg, #7ed321 0%, #56bf47 100%);
	color: white;
	padding: 28rpx 80rpx;
	border-radius: 50rpx;
	min-width: 500rpx;
	box-shadow: 
		0 12rpx 32rpx rgba(126, 211, 33, 0.4),
		0 6rpx 16rpx rgba(126, 211, 33, 0.2);
	transition: all 0.3s ease;
	z-index: 1000;
	margin-bottom: env(safe-area-inset-bottom);
}

.floating-generate-button:active {
	transform: translateX(-50%) translateY(2rpx) scale(0.98);
	box-shadow: 
		0 8rpx 24rpx rgba(126, 211, 33, 0.5),
		0 4rpx 12rpx rgba(126, 211, 33, 0.3);
}

.floating-generate-button.generating {
	background: linear-gradient(135deg, #999 0%, #666 100%);
	pointer-events: none;
	opacity: 0.8;
}

.floating-generate-button.generating .generate-text {
	opacity: 0.8;
}

.generate-text {
	font-size: 36rpx;
	font-weight: 600;
	letter-spacing: 2rpx;
}

/* 结果弹窗样式 */
.result-modal {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: rgba(0, 0, 0, 0.95);
	display: flex;
	align-items: center;
	justify-content: center;
	z-index: 9999;
}

.result-modal-content {
	width: 100%;
	height: 100%;
	max-width: none;
	max-height: none;
	background: white;
	border-radius: 0;
	overflow: hidden;
	box-shadow: none;
	display: flex;
	flex-direction: column;
}

.result-modal-header {
	display: flex;
	justify-content: center;
	align-items: center;
	padding: 20rpx 30rpx;
	position: relative;
	margin-top: 20px;
}

.result-close-button {
	position: absolute;
	left: 20rpx;
	top: calc(50% + 50px);
	transform: translateY(-50%);
	width: 60rpx;
	height: 60rpx;
	background: rgba(0, 0, 0, 0.1);
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	transition: all 0.3s ease;
	cursor: pointer;
}

.result-close-button:hover {
	background: rgba(0, 0, 0, 0.2);
}

.result-close-button:active {
	transform: translateY(-50%) scale(0.95);
	background: rgba(0, 0, 0, 0.3);
}

.result-close-icon {
	color: #666;
	font-size: 40rpx;
	font-weight: 300;
	line-height: 1;
}

.result-modal-title {
	font-size: 40rpx;
	font-weight: 600;
	color: #7ed321;
}


.result-modal-body {
	flex: 1;
	padding: 1rpx 20rpx 40rpx;
	display: flex;
	justify-content: center;
	align-items: center;
	background: #f8f9fa;
}

.result-image {
	width: 100%;
	height: 100%;
	max-width: none;
	max-height: none;
	padding-bottom: 180rpx;
	border-radius: 0;
	box-shadow: none;
	object-fit: contain;
	cursor: pointer;
	transition: all 0.3s ease;
}

.result-image:active {
	transform: scale(0.98);
	opacity: 0.9;
}

.remove-watermark-btn {
	position: absolute;
	bottom: 40rpx;
	left: 50%;
	transform: translateX(-50%);
	padding: 20rpx 50rpx;
	border-radius: 50rpx;
	font-size: 30rpx;
	font-weight: 600;
	border: none;
	transition: all 0.3s ease;
	background: linear-gradient(135deg, #7ed321 0%, #56bf47 100%);
	color: white;
	box-shadow: 0 8rpx 24rpx rgba(126, 211, 33, 0.3);
	width: 60%;
}

.remove-watermark-btn:active {
	transform: translateX(-50%) scale(0.95);
	box-shadow: 0 4rpx 12rpx rgba(126, 211, 33, 0.4);
}

/* 全屏弹窗响应式设计 */
@media (max-width: 750rpx) {
	.result-modal-header {
		padding: 15rpx 20rpx;
	}
	
	.result-close-button {
		left: 15rpx;
		width: 50rpx;
		height: 50rpx;
		top: calc(50% + 50px);
	}
	
	.result-close-icon {
		font-size: 36rpx;
	}
	
	.result-modal-title {
		font-size: 34rpx;
	}
	

	
	.remove-watermark-btn {
		padding: 18rpx 45rpx;
		font-size: 28rpx;
	}
}

/* 平板适配 */
@media (min-width: 768px) {
	.result-modal-header {
		padding: 25rpx 40rpx;
	}
	
	.result-close-button {
		left: 30rpx;
		width: 70rpx;
		height: 70rpx;
		top: calc(50% + 50px);
	}
	
	.result-close-icon {
		font-size: 44rpx;
	}
	
	.result-modal-title {
		font-size: 42rpx;
	}
	

	
	.remove-watermark-btn {
		padding: 24rpx 70rpx;
		font-size: 34rpx;
	}
}

/* 小程序适配 */
.back-button {
	left: 30rpx;
	top: 88rpx;
	width: 80rpx;
	height: 80rpx;
}

.back-icon {
	font-size: 48rpx;
}

.upload-photo-button {
	bottom: 180rpx;
	padding: 20rpx;
}

.upload-avatar {
	width: 100rpx;
	height: 100rpx;
}

.floating-thumbnails {
	right: 0rpx;
	gap: 20rpx;
}

.thumbnail-item {
	width: 100rpx;
	height: 140rpx;
	border-radius: 12rpx 0 0 12rpx;
	border-right: none;
}



.floating-generate-button {
	min-width: 500rpx;
	padding: 28rpx 80rpx;
	bottom: 60rpx;
}

.generate-text {
	font-size: 36rpx;
}

/* 分享活动弹窗样式 */
.share-modal-overlay {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: rgba(0, 0, 0, 0.7);
	display: flex;
	align-items: center;
	justify-content: center;
	z-index: 9999;
	backdrop-filter: blur(10rpx);
	-webkit-backdrop-filter: blur(10rpx);
	padding: 60rpx 40rpx;
}

.share-modal-content {
	width: 100%;
	height: 100%;
	max-width: 700rpx;
	height: calc(75vh + 400rpx);
	max-height: 90vh;
	position: relative;
	background: transparent;
	border-radius: 24rpx;
	overflow: hidden;
	box-shadow: 0 24rpx 60rpx rgba(0, 0, 0, 0.3);
	animation: modalSlideIn 0.3s ease-out;
}

@keyframes modalSlideIn {
	from {
		transform: scale(0.9);
		opacity: 0;
	}
	to {
		transform: scale(1);
		opacity: 1;
	}
}

.activity-image-container {
	position: relative;
	width: 100%;
	height: 100%;
	background: transparent;
	display: flex;
	align-items: center;
	justify-content: center;
}

.activity-image {
	width: 100%;
	height: 100%;
	display: block;
	border-radius: 24rpx;
	background: transparent;
}

.share-buttons-group {
	position: absolute;
	bottom: 40rpx;
	left: 50%;
	transform: translateX(-50%);
	display: flex;
	justify-content: center;
	z-index: 11;
	width: calc(100% - 40rpx);
}

.share-button {
	background: linear-gradient(135deg, #ff6b35 0%, #ff8f42 100%);
	color: white;
	padding: 24rpx 30rpx;
	border-radius: 50rpx;
	font-size: 24rpx;
	font-weight: 600;
	box-shadow: 0 12rpx 32rpx rgba(255, 107, 53, 0.4);
	transition: all 0.3s ease;
	cursor: pointer;
	backdrop-filter: blur(10rpx);
	-webkit-backdrop-filter: blur(10rpx);
	text-align: center;
	line-height: 1.4;
	width: 100%;
}

.share-button.join-activity-button {
	background: linear-gradient(135deg, #ff6b35 0%, #ff8f42 100%);
	box-shadow: 0 12rpx 32rpx rgba(255, 107, 53, 0.4);
	font-size: 28rpx;
	font-weight: 700;
}

.share-button.payment-button {
	background: linear-gradient(135deg, #4CAF50 0%, #66BB6A 100%);
	box-shadow: 0 12rpx 32rpx rgba(76, 175, 80, 0.4);
}

.share-button:active {
	transform: scale(0.95);
	box-shadow: 0 8rpx 24rpx rgba(255, 107, 53, 0.6);
}

.share-button.payment-button:active {
	box-shadow: 0 8rpx 24rpx rgba(76, 175, 80, 0.6);
}

.share-text {
	color: white;
	font-weight: 600;
}

.red-text {
	color: #ff3333;
	font-weight: 700;
}

.close-button {
	position: absolute;
	top: 200rpx;
	left: 5rpx;
	width: 60rpx;
	height: 60rpx;
	background: rgba(0, 0, 0, 0.6);
	color: white;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 32rpx;
	font-weight: 300;
	z-index: 11;
	backdrop-filter: blur(10rpx);
	-webkit-backdrop-filter: blur(10rpx);
	transition: all 0.3s ease;
}

.close-button:active {
	transform: scale(0.95);
	background: rgba(0, 0, 0, 0.7);
}

.close-text {
	color: white;
	font-size: 40rpx;
	line-height: 1;
}

/* 结果弹窗底部操作区域 */
.result-bottom-actions {
	position: absolute;
	bottom: 200rpx; /* 向上移动100像素（约200rpx） */
	left: 0;
	right: 0;
	padding: 20rpx 30rpx;
	background: transparent; /* 改为透明背景 */
	display: flex;
	justify-content: center;
	z-index: 10;
}

.view-original-btn {
	padding: 20rpx 50rpx;
	border-radius: 50rpx;
	font-size: 30rpx;
	font-weight: 600;
	border: none;
	transition: all 0.3s ease;
	background: linear-gradient(135deg, #7ed321 0%, #56bf47 100%);
	color: white;
	box-shadow: 0 8rpx 24rpx rgba(126, 211, 33, 0.3);
	width: 60%;
}

.view-original-btn:active {
	transform: scale(0.95);
	box-shadow: 0 4rpx 12rpx rgba(126, 211, 33, 0.4);
}

.btn-text-wrapper {
	display: flex;
	flex-direction: column;
	align-items: center;
}

.btn-main-text {
	font-size: 30rpx;
	font-weight: 600;
	color: white;
}

.btn-sub-text {
	font-size: 24rpx;
	color: #ccc;
	margin-top: 4rpx;
}

.free-text {
	color: #7ed321;
	font-weight: 700;
}

/* 水印提示样式 */
.watermark-tip {
	position: absolute;
	top: 10rpx;
	right: 10rpx;
	background: rgba(0, 0, 0, 0.6);
	color: white;
	padding: 8rpx 12rpx;
	border-radius: 20rpx;
	font-size: 24rpx;
	font-weight: 500;
	z-index: 10;
	backdrop-filter: blur(10rpx);
	-webkit-backdrop-filter: blur(10rpx);
}

.tip-text {
	color: #7ed321;
}

/* 分享按钮样式 */
.result-share-actions {
	position: absolute;
	bottom: 380rpx; /* 调整位置，与上移后的付费去水印按钮保持间距 */
	left: 0;
	right: 0;
	padding: 20rpx 30rpx;
	background: transparent; /* 改为透明背景 */
	display: flex;
	justify-content: center;
	z-index: 10;
	animation: fadeIn 0.5s ease;
}

.share-result-btn {
	padding: 20rpx 50rpx;
	border-radius: 50rpx;
	font-size: 30rpx;
	font-weight: 600;
	border: none;
	transition: all 0.3s ease;
	background: linear-gradient(135deg, #4285f4 0%, #34a0f2 100%);
	color: white;
	box-shadow: 0 8rpx 24rpx rgba(66, 133, 244, 0.3);
	width: 60%;
}

.share-result-btn:active {
	transform: scale(0.95);
	box-shadow: 0 4rpx 12rpx rgba(66, 133, 244, 0.4);
}

@keyframes fadeIn {
	from {
		opacity: 0;
		transform: translateY(20rpx);
	}
	to {
		opacity: 1;
		transform: translateY(0);
	}
}

/* 奖励弹窗样式 */
.dialog-mask {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background-color: rgba(0, 0, 0, 0.6);
	z-index: 999;
}

.dialog-content {
	position: fixed;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	width: 80%;
	background-color: #fff;
	border-radius: 12px;
	padding: 30px 20px;
	z-index: 1000;
	box-shadow: 0 0 20px rgba(0, 0, 0, 0.2);
}

.dialog-title {
	font-size: 18px;
	font-weight: bold;
	text-align: center;
	margin-bottom: 20px;
	color: #333;
}

.reward-content {
	padding-bottom: 20px;
}

.qrcode-container {
	width: 200px;
	height: 200px;
	margin: 0 auto 20px;
	border: 1px solid #eee;
	padding: 10px;
	border-radius: 8px;
	background-color: #fff;
}

.qrcode-image {
	width: 100%;
	height: 100%;
}

.coupon-info {
	margin-bottom: 20px;
	padding: 0 10px;
}

.coupon-code,
.coupon-expire {
	font-size: 14px;
	color: #666;
	margin-bottom: 5px;
	text-align: center;
}

.coupon-desc {
	font-size: 12px;
	color: #999;
	text-align: center;
	margin-top: 10px;
}

.dialog-buttons {
	display: flex;
	justify-content: space-around;
}

.save-btn {
	background: linear-gradient(135deg, #4CAF50, #2E8B57);
	color: white;
	border: none;
	padding: 10px 30px;
	border-radius: 30px;
	font-size: 14px;
}

.close-btn {
	background-color: #f5f5f5;
	color: #666;
	border: 1px solid #ddd;
	padding: 10px 30px;
	border-radius: 30px;
	font-size: 14px;
}

/* 保存成功提示 */
.save-success {
	position: fixed;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	background-color: rgba(0, 0, 0, 0.7);
	color: white;
	padding: 15px 30px;
	border-radius: 30px;
	z-index: 1001;
}

.success-content {
	display: flex;
	flex-direction: column;
	align-items: center;
}

.success-content .iconfont {
	font-size: 24px;
	margin-bottom: 5px;
}

.success-text {
	font-size: 14px;
}

/* 首页活动弹窗样式 */
.home-modal-overlay {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: rgba(0, 0, 0, 0.7);
	display: flex;
	align-items: center;
	justify-content: center;
	z-index: 9999;
	backdrop-filter: blur(10rpx);
	-webkit-backdrop-filter: blur(10rpx);
	padding: 60rpx 40rpx;
}

.home-modal-content {
	width: 90%;
	max-width: 700rpx;
	height: calc(75vh + 400rpx);
	max-height: 90vh;
	position: relative;
	background: transparent;
	border-radius: 24rpx;
	overflow: hidden;
	box-shadow: 0 24rpx 60rpx rgba(0, 0, 0, 0.3);
	animation: homeModalSlideIn 0.3s ease-out;
	padding: 0;
	margin: 0;
}

@keyframes homeModalSlideIn {
	from {
		transform: scale(0.9);
		opacity: 0;
	}

	to {
		transform: scale(1);
		opacity: 1;
	}
}

.home-activity-image {
	width: 100%;
	height: 100%;
	display: block;
	background: transparent;
}

/* 关闭按钮样式 */
.home-close-button {
	position: absolute;
	bottom: 160rpx;
	left: 50%;
	transform: translateX(-50%);
	background: rgba(0, 0, 0, 0.5);
	backdrop-filter: blur(20rpx);
	-webkit-backdrop-filter: blur(20rpx);
	color: white;
	padding: 16rpx 32rpx;
	border-radius: 40rpx;
	font-size: 24rpx;
	font-weight: 500;
	border: 1rpx solid rgba(255, 255, 255, 0.3);
	box-shadow: 0 8rpx 24rpx rgba(0, 0, 0, 0.2);
	transition: all 0.3s ease;
	cursor: pointer;
	z-index: 12;
	min-width: 120rpx;
	text-align: center;
}

.home-close-button:active {
	transform: translateX(-50%) scale(0.95);
	background: rgba(0, 0, 0, 0.7);
	box-shadow: 0 4rpx 16rpx rgba(0, 0, 0, 0.3);
}

.home-close-text {
	color: white;
	font-weight: 500;
}

.home-share-buttons-group {
	position: absolute;
	bottom: 40rpx;
	left: 50%;
	transform: translateX(-50%);
	display: flex;
	justify-content: center;
	z-index: 11;
	width: calc(100% - 40rpx);
}

.home-share-button {
	background: linear-gradient(135deg, #ff6b35 0%, #ff8f42 100%);
	color: white;
	padding: 24rpx 30rpx;
	border-radius: 50rpx;
	font-size: 28rpx;
	font-weight: 600;
	box-shadow: 0 12rpx 32rpx rgba(255, 107, 53, 0.4);
	transition: all 0.3s ease;
	cursor: pointer;
	backdrop-filter: blur(10rpx);
	-webkit-backdrop-filter: blur(10rpx);
	text-align: center;
	line-height: 1.4;
	width: 100%;
}

.home-share-button.home-join-activity-button {
	background: linear-gradient(135deg, #ff6b35 0%, #ff8f42 100%);
	box-shadow: 0 12rpx 32rpx rgba(255, 107, 53, 0.4);
	font-size: 28rpx;
	font-weight: 700;
}

.home-share-button:active {
	transform: scale(0.95);
	box-shadow: 0 8rpx 24rpx rgba(255, 107, 53, 0.6);
}

.home-share-text {
	color: white;
	font-weight: 600;
}

.works-icon-image-only {
	width: 70rpx;
	height: 70rpx;
}

/* 新增文本图标样式 */
.works-icon-text {
	width: 80rpx;
	height: 80rpx;
	border-radius: 50%;
	padding: 15rpx;
	background: white;
	position: relative;
	z-index: 2;
	border: 3rpx solid rgba(255, 255, 255, 0.8);
	box-shadow: 0 2rpx 8rpx rgba(0, 0, 0, 0.2); /* 减少阴影 */
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 40rpx;
}
</style>